<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户页面</title>
    <link rel="stylesheet" href="static/css/user.css">
</head>
<body>
<div id="app">
    <h1>用户列表</h1>
    <table>
        <tr>
            <th>用户编号</th>
            <th>用户名</th>
            <th>密码</th>
            <th>用户等级</th>
            <th>用户头像</th>
            <th>手机号</th>
            <th>邮箱</th>
            <th>注册时间</th>
            <th>状态</th>
        </tr>
        <tr v-for="(item,index) in userArr" :title="item.Id">
            <td>{{ item.id }}</td>
            <td>{{ item.username }}</td>
            <td>{{ item.password }}</td>
            <td>{{ item.level }}</td>
            <td>{{ item.image }}</td>
            <td>{{ item.phone }}</td>
            <td>{{ item.email }}</td>
            <td>{{ item.registerTime }}</td>
            <td>{{ item.status == 1 ? "在使用" : "已注销" }}</td>
        </tr>
    </table>
</div>
</body>
<script src="static/js/vue2.js"></script>
<script src="static/js/axios.js"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            userArr: [],
        },
        methods: {
            getAllUser:function(){
                var that = this;
                // 查询所有数据
                axios.get("GetAllUserServlet").then(function(response){
                    that.userArr = response.data;
                    console.log(that.userArr)
                }),function(err){
                    console.log(err);
                }
            },
        },
        mounted: function () {
            this.getAllUser();
        }
    })
</script>
</html>